/* shop/integral/integral.wxss */
.page {
  width: 100%;
  height: 100vh;
  overflow: hidden;
  background: rgb(57, 58, 98);
  display: flex;
  flex-direction: column;

  .integral {
    flex: 1;
    overflow-x: hidden;
    padding: 10rpx;
    display: flex;
    flex-direction: column;

    .card {
      position: relative;
      margin: 26rpx auto;
      padding: 60rpx 40rpx 40rpx;
      height: 310rpx;
      box-sizing: border-box;
      border-radius: 20px;
      background: linear-gradient(180.00deg, rgba(157, 158, 196, 0.8), rgba(35, 35, 59, 0.8) 100%);
      opacity: 0.79;

      .t1 {
        color: rgb(255, 255, 255);
        font-family: 思源黑体 CN;
        font-size: 30rpx;
        font-weight: 500;
        line-height: 45rpx;
        letter-spacing: 1.2rpx;
        text-align: left;
      }

      .int {
        display: flex;
        margin-top: 20rpx;
        margin-bottom: 30rpx;

        .num {
          color: rgb(208, 174, 121);
          font-family: Helvetica;
          font-size: 60rpx;
          font-weight: 400;
          line-height: 60rpx;
          letter-spacing: 2.4rpx;
        }

        .unit {
          color: rgb(208, 174, 121);
          font-size: 24rpx;
          font-weight: 400;
          line-height: 60rpx;
          letter-spacing: 2.4rpx;
          margin-left: 10rpx;
          margin-top: 20rpx;
        }
      }

      .t2 {
        color: rgb(255, 255, 255);
        font-family: 思源黑体 CN;
        font-size: 23rpx;
        font-weight: 350;
        line-height: 35rpx;
        letter-spacing: 0.92rpx;
        text-align: left;
      }
    }

    .card2 {
      flex: 1;
      overflow-x: hidden;
      border-radius: 20rpx;
      background: rgba(255, 255, 255, .2);
      display: flex;
      flex-direction: column;

      .header {
        display: flex;
        align-items: center;
        height: 97rpx;

        .nav {
          font-family: 思源黑体 CN;
          font-size: 25rpx;
          font-weight: 400;
          line-height: 38rpx;
          display: flex;
          align-items: center;
          justify-content: space-between;
          box-sizing: border-box;
          width: 66%;
          height: 100%;
          padding-left: 53rpx;

          .nav-item {
            position: relative;
            text-align: center;
            color: rgba(255, 255, 255, .6);
            transition: all linear 0.2s;
          }

          .nav-item-line {
            position: absolute;
            width: 100%;
            height: 5rpx;
            bottom: -16rpx;
            left: 0;
            border-radius: 2.5rpx;
            background: rgb(255, 255, 255);
            background-color: #fff;
          }

          .active {
            color: rgb(255, 255, 255);
          }
        }

        .rili {
          flex: 1;
          text-align: center;

          .picker {
            font-size: 25rpx;
            line-height: 38rpx;
            display: flex;
            align-items: center;
            justify-content: center;
            color: rgba(255, 255, 255, .6);
            box-sizing: border-box;
          }
        }
      }

      .list {
        flex: 1;
        overflow-x: hidden;

        .item {
          height: 163rpx;
          border-top: 2rpx solid rgba(196, 196, 196, .2);
          display: flex;
          align-items: center;
          justify-content: space-between;
          padding: 0 45rpx 0 50rpx;
          box-sizing: border-box;

          .title {
            color: rgb(255, 255, 255);
            font-family: 思源黑体 CN;
            font-size: 25rpx;
            font-weight: 400;
            line-height: 38rpx;
            margin-bottom: 15rpx;
          }

          .time {
            font-size: 20rpx;
            font-family: 思源黑体 CN;
            color: rgb(255, 255, 255);
          }

          .num {
            font-size: 36rpx;
            margin-right: 4rpx;
            color: rgb(208, 174, 121);
          }

          .unit {
            color: rgb(208, 174, 121);
            font-size: 23rpx;
          }

          image {
            transform: rotate(-90deg);
            margin-left: 10rpx;
          }
        }


      }
    }
  }
}

.tt1 {
  color: rgb(255, 255, 255);
  font-size: 23rpx;
  line-height: 35rpx;
  text-align: center;
  height: 60rpx;
  padding-top: 43rpx;
  padding-bottom: 30rpx;
}